@prefix: 'gratify';
@btnPrefix: ~'@{prefix}-btn';
@cardPrefix: ~'@{prefix}-card';
@spacePrefix: ~'@{prefix}-space';

// 色系

// 默认
@gratify-default-color: #000000d9;
@gratify-default-bg: #fff;
@gratify-default-border-color: #d9d9d9;

// 高亮
@gratify-highlight-color: #fff;
@gratify-highlight-bg: #1890ff;
@gratify-highlight-border-color: #1890ff;

// 禁用
@gratify-disabled-color: #000000d9;
@gratify-disabled-bg: #f5f5f5;
@gratify-disabled-border-color: #d9d9d9;

// 字体
@font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
  'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji',
  'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';

:root {
  --gratify-primary-color: #2a82ff;
  --gratify-primary-color-hover: #2271e1;
  --gratify-primary-color-active: #2271e1;
  --gratify-primary-color-light: rgba(42, 130, 255, 10%);
  // 默认白色
  --gratify-default-white-color: #fff;
  // 默认黑色
  --gratify-default-black-color: #000;
  // 次要颜色
  --gratify-warning-color: #ffa600;
  --gratify-warning-color-hover: #cc8400;
  --gratify-warning-color-active: #cc8400;
  // 危险颜色
  --gratify-danger-color: #ff5735;
  --gratify-danger-color-hover: #cc452a;
  --gratify-danger-color-active: #cc452a;
  // 警告颜色
  --gratify-secondary-color: #dbe0e5;
  --gratify-secondary-color-hover: #c4c9cd;
  --gratify-secondary-color-active: #c4c9cd;
  // 过渡
  --gratify-all-transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
  // 边框颜色
  --gratify-border-color: #d9d9d9;
  // 文本颜色
  --gratify-text-color: #111;
  // 默认按钮
  --gratify-button-default-font-size: 13px;
  --gratify-button-default-border-radius: 6px;
}

:root[data-theme='red'] {
  --gratify-primary-color: #e23;
  --gratify-primary-color-hover: #be1b28;
  --gratify-primary-color-active: #be1b28;
  --gratify-primary-color-light: rgba(238, 34, 51, 10%);
}

:root[data-theme='green'] {
  --gratify-primary-color: #02a14b;
  --gratify-primary-color-hover: #069346;
  --gratify-primary-color-active: #069346;
  --gratify-primary-color-light: rgba(2, 161, 75, 10%);
}

* {
  // font-family: @font-family;
}

p {
  margin: 0;
  color: var(--gratify-text-color);
}

a {
  color: var(--gratify-primary-color);
  text-decoration: none;
  transition: var(--gratify-all-transition);
}

a:hover {
  color: var(--gratify-primary-color-hover);
}

// blue: '#1677ff',
// purple: '#722ED1',
// cyan: '#13C2C2',
// green: '#52C41A',
// magenta: '#EB2F96',
// pink: '#eb2f96',
// red: '#F5222D',
// orange: '#FA8C16',
// yellow: '#FADB14',
// volcano: '#FA541C',
// geekblue: '#2F54EB',
// gold: '#FAAD14',
// lime: '#A0D911'
